import React, { Component } from 'react'
import { connect } from 'react-redux'

// * 一次性把所有的按需导出的模块导入过来,并且使用as起一个别名,actions是一个对象
import * as actions from '@/action/filmAction'
// import {getFilmListAction} from '@/action/filmAction'

// @connect(state=>state.get('film').toJS(),{getFilmListAction})
@connect(state => state.get('film').toJS(), actions)
class Film extends Component {
  componentDidMount() {
    this.props.getFilmListAction()
  }

  render() {
    console.log(this.props.films)
    return (
      <div>
        <ul>
          {/* 条件渲染 */}
          {this.props.films.length === 0 ? (
            <li>玩命加载中...</li>
          ) : (
            this.props.films.map(item => <li key={item.id}>{item.title}</li>)
          )}
        </ul>
      </div>
    )
  }
}

export default Film
